Ext.onReady(function(){
	/*Ext.create('Ext.tab.Panel', {
		renderTo: Ext.getBody(),
		height: 100,
		width: 200,
		items: [
			{
				// Explicitly define the xtype of this Component configuration.
				// This tells the Container (the tab panel in this case)
				// to instantiate a Ext.panel.Panel when it deems necessary
				xtype: 'panel',
				title: 'Tab One',
				html: 'The first tab',
				listeners: {
					render: function() {
						Ext.MessageBox.alert('Rendered One', 'Tab One was rendered.');
					}
				}
			},
			{
				// this component configuration does not have an xtype since 'panel' is the default
				// xtype for all Component configurations in a Container
				title: 'Tab Two',
				html: 'The second tab',
				listeners: {
					render: function() {
						Ext.MessageBox.alert('Rendered One', 'Tab Two was rendered.');
					}
				}
			}
		]
	});*/
	Ext.create('Ext.form.Panel', {
    title: 'Simple Form',
    bodyPadding: 5,
    width: 350,

    // The form will submit an AJAX request to this URL when submitted
    url: 'save-form.php',

    // Fields will be arranged vertically, stretched to full width
    layout: 'anchor',
    defaults: {
        anchor: '100%'
    },

    // The fields
    defaultType: 'textfield',
    items: [{
        fieldLabel: 'First Name',
        name: 'first',
        allowBlank: false
    },{
        fieldLabel: 'Last Name',
        name: 'last',
        allowBlank: false
    }],

    // Reset and Submit buttons
    buttons: [{
        text: 'Reset',
        handler: function() {
            this.up('form').getForm().reset();
        }
    }, {
        text: 'Submit',
        formBind: true, //only enabled once the form is valid
        disabled: true,
        handler: function() {
            var form = this.up('form').getForm();
            if (form.isValid()) {
                form.submit({
                    success: function(form, action) {
                       Ext.Msg.alert('Success', action.result.msg);
                    },
                    failure: function(form, action) {
                        Ext.Msg.alert('Failed', action.result.msg);
                    }
                });
            }
        }
    }],
    renderTo: Ext.getBody()
});

});